'use client';

import { useEffect } from 'react';
import { Button } from '@/components/ui/button';

export default function Error({
  error,
  reset,
}: {
  error: Error & { digest?: string };
  reset: () => void;
}) {
  useEffect(() => {
    // 过滤权限相关错误，不记录到控制台
    if (!error.message.includes('Permissions check failed') &&
        !error.message.includes('Permission denied') &&
        !error.message.includes('fullscreen')) {
      console.error('PPT Editor Error:', error);
    }
  }, [error]);

  // 如果是权限相关错误，自动重置
  useEffect(() => {
    if (error.message.includes('Permissions check failed') ||
        error.message.includes('Permission denied') ||
        error.message.includes('fullscreen')) {
      setTimeout(() => {
        reset();
      }, 100);
    }
  }, [error, reset]);

  // 对于权限错误，不显示错误界面
  if (error.message.includes('Permissions check failed') ||
      error.message.includes('Permission denied') ||
      error.message.includes('fullscreen')) {
    return null;
  }

  return (
    <div className="flex flex-col items-center justify-center min-h-[400px] p-8">
      <h2 className="text-xl font-semibold text-red-600 mb-4">PPT编辑器出现问题</h2>
      <p className="text-gray-600 mb-4 text-center">
        {error.message || '未知错误'}
      </p>
      <Button onClick={reset} variant="outline">
        重新加载
      </Button>
    </div>
  );
}